<template>
	<view>
		<dsl-navbar title="订单确认" isBack bgTopImg='white'></dsl-navbar>
		<view>
			<view class="address_body rowsb margin-top-sm" @click="addressMen()" v-if="addressData ==''">
				<view class="align-center">
					<image src="/static/icon/icon_tianja.png" mode="" class="address_add"></image>
					<view class="address_select">请选择收货地址</view>
				</view>
				<view class="cuIcon-right"></view>
			</view>
			<view class="address_body2 bg-white padding  solid-bottom" v-else @click="addressMen()">
				<view class="rowsb">
					<view class="title">姓名：{{addressData.contacts}}</view>
					<view class="phone">手机号：{{addressData.contact_number}}</view>
				</view>
				<view class="address margin-top onelineshow">地址：{{addressData.address}} {{addressData.detailed_address}}
				</view>
			</view>
		</view>
		<view class="bg-white padding-tb margin-top-sm" v-for="(item,index) in commodityData" :key='index'>
			<view class="book_body flex  ">
				<image :src="item.image" mode="aspectFill"></image>
				<view class="margin-left margin-top">
					<view class="shopping_title onelineshow">{{item.name}}</view>
					<view class="shopping_content towlineshow">下单时间：{{item.createtime }}</view>
					<view class="flex  shopping_operation">
						<view class="shopping_pay">
							<text style="color: #777777;">
								配置金额:￥{{item.unit_price}}
							</text>
							<view style="font-size: 30rpx;color: #FF4929;font-weight: bold;margin-top: 30rpx;">支付订金：￥{{item.deposit}}
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="rowsb align-center margin">
				<view class="order_title">购买数量</view>
				{{item.number}}
				<!-- <view class="shopping_plugins">
					<view class="plugins_subtract">-</view>
					<view class="plugins_num">1</view>
					<view class="plugins_add">+</view>
				</view> -->
			</view>
			<view class="rowsb align-center margin">
				<view class="">支付定金</view>
				<view>￥{{item.deposit}}</view>
			</view>
			<view class="rowsb align-center margin">
				<view class="">运费</view>
				<view>+￥0.00</view>
			</view>
			<!-- 	<view class="rowsb align-center margin">
				<view class="">优惠券</view>
				<view>-￥0.00</view>
			</view> -->
		</view>


		<view class="align-center rowsb padding bg-white order_fixed">
			<view class="order_pay">
				<text style="font-size: 22rpx;">￥</text>
				<text class="">{{totalPrice}}</text>
			</view>
			<view class="order_submit" @click="orderSubmit">
				确认支付
			</view>
		</view>
	</view>
</template>

<script>
	import {
		get_address,
		post_shoppingCartOrder,
		post_delCat
	} from '../../common/path.js'
	export default {
		data() {
			return {
				addressData: [], //地址状态
				commodityData: [], //订单
				totalPrice: 0, //总价格
			}
		},
		onLoad(option) {
			this.commodityData = JSON.parse(option.commodityData)
			this.totalPrice = option.zongjia
		},
		onShow() {
			this.getAddress() //地址
		},
		methods: {
			//获取收货地址
			getAddress() {
				this.Http.POST(get_address, {}).then((res) => {
					if (res.code == 1) {
						res.data.forEach(item => {
							if (item.switch == 1) {
								this.addressData = item
								console.log('[addressData]', item);
							} else {
								this.addressData = res.data[0]
							}
						})
					} else if (res.code == 401) {
						this.$tools.showToast(res.msg)
						this.addressData = []
					} else {
						this.addressData = []
					}
					console.log('[地址]', this.addressData);
				})
			},

			//订单确认
			orderSubmit() {
				if(this.addressData==''){
					this.$tools.showToast('请选择地址')
					return
				}
				let array = []
				this.commodityData.forEach(item => {
					let stringData = item.id + ':' + 1
					array.push(stringData)
				})
				console.log('[下单信息]', array.toString());
				let object = {
					string: array.toString(),
					receiving_address_id:this.addressData.id
				}
				this.Http.POST(post_shoppingCartOrder, object)
					.then((res) => {
						if (res.code == 1) {
							console.log('[订单提交]', res);
							this.$tools.showToast2('下单成功')
							this.post_delCat(res.data.orderno)
						} else {
							this.$tools.showToast(res.msg)
						}
					})
			},
			//购物车下单支付
			post_delCat(orderno) {
			
				let object = {
					orderno: orderno,
				}
				this.Http.POST(post_delCat, object)
					.then((res) => {
						if (res.code == 1) {
							console.log('[订单提交]', res);
							this.$tools.showToast2('下单成功')
								let dara = res.data
							uni.requestPayment({
								nonceStr: dara.nonceStr, //随机字符串
								package: dara.package, //下单接口返回参数
								timeStamp: dara.timeStamp, //时间戳
								signType: dara.signType, //签名算法，应与后台一致
								paySign: dara.paySign, //签名
								success: function(aaa) {
									uni.showToast({
										title: '支付成功'
									})
								},
								fail: function(err) {
									console.log('支付失败===>', err)
									uni.showToast({
										title: '支付失败',
										icon: 'none'
									})
								},
							})

						} else {
							this.$tools.showToast(res.msg)
						}
					})
			},


			//地址跳转
			addressMen() {
				uni.navigateTo({
					url: '/pages/address/index'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	// 地址
	.address_body {
		background-color: white;
		height: 170rpx;
		line-height: 170rpx;
		padding-left: 30rpx;
		padding-right: 30rpx;

		.address_add {
			width: 48rpx;
			height: 48rpx;
			opacity: 1;
		}

		.address_select {
			font-size: 30rpx;
			font-family: PingFang SC;
			font-weight: 400;
			color: #9AA2B5;
			opacity: 1;
			margin-left: 20rpx;
		}
	}

	page {
		background: #F5F6F8;
		padding-bottom: 140rpx;
	}

	// 书籍信息

	.book_body {
		position: relative;
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 0 auto;
		margin: 30rpx;

		image {
			width: 195rpx;
			height: 252rpx;
			background: #7F7F7F;
			opacity: 1;
			border-radius: 10rpx;
		}

		.book_title {
			width: 379rpx;
			height: 42rpx;
			font-size: 30rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #333333;
			opacity: 1;
		}

		.book_content {
			width: 450rpx;
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 400;
			color: #777777;
			opacity: 1;
			margin-top: 30rpx;
		}

		.book_num {
			position: absolute;
			bottom: 20rpx;
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 400;
			color: #777777;
			opacity: 1;
		}
	}

	// 规格
	.shopping_plugins {
		width: 177rpx;
		height: 46rpx;
		background: #FFFFFF;
		border: 2rpx solid #DEDEDE;
		opacity: 1;
		text-align: center;
		border-radius: 9rpx;
		line-height: 46rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;

		.plugins_subtract {
			width: 42rpx;
			height: 36rpx;
			background: #F6F7F9;
			opacity: 1;
			border-radius: 9rpx 0px 0px 9rpx;
			line-height: 36rpx;
		}

		.plugins_num {}

		.plugins_add {
			width: 42rpx;
			height: 36rpx;
			background: #F6F7F9;
			opacity: 1;
			border-radius: 0px 9rpx 9rpx 0px;
			line-height: 36rpx;
		}
	}

	.order_title {
		font-family: PingFang SC;
		font-weight: 400;
		color: #8A857C;
		opacity: 1;
	}

	//支付
	.pay_way {
		padding: 30rpx;
		background-color: white;
		display: flex;
		align-items: center;

		.pay_way_image {
			width: 71rpx;
			height: 71rpx;
		}

		.pay_icon {
			width: 33rpx;
			height: 33rpx;
		}

		.label {
			width: 157rpx;
			height: 53rpx;
			border: 1px solid #FF804D;
			opacity: 1;
			line-height: 53rpx;
			border-radius: 99rpx;
			color: #FF804D;
			text-align: center;
			margin-left: 50rpx;
		}

	}

	.order_pay {
		font-size: 44rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #FF4929;
		opacity: 1;
	}

	.order_submit {
		width: 268rpx;
		height: 76rpx;
		background: linear-gradient(180deg, #FF6B2B 0%, #FF8A19 100%);
		opacity: 1;
		border-radius: 38rpx;
		line-height: 76rpx;
		text-align: center;
		color: white;
	}

	.order_fixed {
		position: fixed;
		bottom: 0;
		width: 100%;
	}

	.address_body2 {
		.title {
			width: 340rpx;
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #3C3C3C;
			opacity: 1;
		}

		.phone {
			font-size: 22rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #3C3C3C;
			opacity: 1;
		}

		.address {
			width: 654rpx;
			font-size: 22rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #3C3C3C;
			opacity: 1;
		}
	}
</style>
